<template>

    <div class="hero">
        英雄的名字:{{ name }} , 英雄的攻击力:{{ attack }}
    </div>


</template>

<script setup lang="ts" name='Hero'>

//写法3  可选属性 attack  和默认值
interface Hero {
    name: string;
    attack?: number;  //可选属性
}

//定义属性的默认值
withDefaults(defineProps<Hero>(),


    {
        name: '',
        attack: 500
    }

)



</script>

<style scoped>
.hero {

    width: 100%;
    min-height: 80px;
    line-height: 80px;
    margin: 10px;
    background-color: cadetblue;


}
</style>